<template>
    <view class="wrapper">
        <u-tabs
            class="tab-bar"
            :activeStyle="{color: '#18D5BB'}"
            lineColor="#18D5BB"
            :scrollable="scrollable"
            :list="list"
            :current="current"
            @change="itemChange"  />
    </view>
</template>

<script>
    export default {
        name: 'TagBar',
        props: {
            list: {
                type: Array,
                required: true
            },
            current: {
                type: Number,
                required: true,
                default: 0
            },
            scrollable: {
                type: Boolean,
                required: false,
                default: false
            }
        },
        methods: {
            itemChange(info) {
                this.$emit('change', info);
            }
        }
    };
</script>

<style lang="scss" scoped>
.wrapper{
    width: 100vw;
    background-color: white;
    .tab-bar{
        width: 100%
    }
}
</style>
